; (function ($) {
    "use strict";
    // message:' 操作成功',    //提示信息
    // duration:'5000',       //显示时间（默认：5s）
    // type:'info',           //显示类型，包括4种：success.error,info,warning 默认info
    // showClose:false,       //显示关闭按钮（默认：否）
    // center:true,           //页面竖直居中（默认：否）
    // onClose:function,      //点击关闭回调函数
    $.message = function (options) {

        let { message, duration, type, showClose, center, onClose } = options;
        type = type || 'info';
        showClose = showClose === true ? showClose : false;
        center = center === true ? center : false;
        //0判断是认为是false,单独判断
        if (duration == 0) {
            duration = 0;
        } else {
            duration = duration || 5000;
        }

        //不同的type则不同的颜色、样式
        let color = {};
        if (type === 'info') { color = { bC: '#edf3fd', fC: '#00f', icon: '!' } };
        if (type === 'success') { color = { bC: '#eff7ea', fC: '#0f0', icon: '」' } };
        if (type === 'warning') { color = { bC: '#fef6ea', fC: '#f90', icon: '!' } };
        if (type === 'error') { color = { bC: '#fff2f0', fC: '#f00', icon: 'X' } };

        //如果center则起始于屏幕中间
        let msgTop = center === true ? $(window).height() / 2 - 50 : 10;

        //如果页面已经存在一个提示,则先删除提示框
        if ($('.message')) {
            $('.message').remove();
        }

        //添加一个提示框
        $('body').append($(`<div class="message">${message}</div>`));

        //如果是warning添加小叉叉
        if (showClose === true) {
            $('.message').append($('<p class = "close">x</p>'))
            $('.message .close').css({
                position: 'absolute',
                width: 14,
                height: 14,
                font: '14px/1 ""',
                transform: 'scale(1.4)',
                right: 20,
                top: 0,
                bottom: 0,
                margin: 'auto 0',
                color: '#000'
            });
        }

        //小图标信息的样式
        $('.message').append(`<div class="icon ${type}">${color.icon}</div>`);
        $('.message .icon').css({
            position: 'absolute',
            width: 20,
            height: 20,
            font: '700 14px/20px ""',
            textAlign: 'center',
            background: color.fC,
            color: '#fff',
            borderRadius: '50%',
            left: 18,
            top: 0,
            bottom: 0,
            margin: 'auto 0'
        });

        $('.message .success').css({
            paddingLeft: '5px',
            transform: 'rotateZ(45deg)',
            font: '700 23px / 10px ""'
        })

        //加样式,并动起来
        $('.message').css({
            border: '1px solid #ddd',
            paddingLeft: 50,
            background: color.bC,
            position: 'fixed',
            width: 360,
            height: 50,
            font: '15px/50px ""',
            left: 0,
            right: 0,
            top: msgTop,
            margin: '0 auto',
            zIndex: 100,
            borderRadius: '7px',
        }).stop().animate({
            top: msgTop + 50
        }).delay(duration).hide(0);

        //点击关闭
        $('.close').on('click', function () {
            //有则调用回调函数并关闭,没有直接关闭
            onClose ? onClose() : null;
            $('.message').hide();
        });
    }
})(jQuery);